<template>
	<div class="boss">
		<Head title="驻会机构" style="border-bottom: none"> </Head>
		<Banner></Banner>
		<!-- 标题区域 -->
		<div class="text">{{ this.$route.query.citytitle }}</div>
		<!-- 整体区域 -->
		<div class="center">
			<div class="xiao" v-for="(item, index) in list" :key="index">
				<div class="left">
					<img src="../../../assets/black_star.png" alt="" />
				</div>
				<div class="zhong richText" v-html="item.organizationText"></div>
			</div>
		</div>
	</div>
</template>

<script>
import { getInfoByOrIdAndPro } from "@/api/index"
import Head from "@/components/public/HeadPage.vue"
import Banner from "@/components/Home/BannerView.vue"
export default {
	data() {
		return {
			ID: this.$route.query.ID,
			city: this.$route.query.citysub,
			list: ""
		}
	},
	components: {
		Head, Banner
	},
	mounted() {
		getInfoByOrIdAndPro(this.ID, this.city).then(res => {
			if (res.data.code == 200) {
				// console.log(res.data.rows);
				this.list = res.data.rows
			}
		})
	}
}
</script>

<style scoped>
.boss {
	width: 100%;
	height: 6rem;
	background-color: #f0eff5;
}
.text {
	width: 100%;
	height: 0.4rem;
	font-weight: 700;
	line-height: 0.4rem;
	background-color: white;
	text-indent: 0.1rem;
	font-size: 0.18rem;
}
.center {
	width: 100%;
	margin-top: 0.1rem;
}
.xiao {
	width: 100%;
	margin-top: 0.05rem;
	display: flex;
}
/* 左边区域 */
.xiao .left {
	width: 5%;
	height: 100%;
	margin-left: 0.1rem;
}
.xiao .left img {
	width: 0.2rem;
	height: 0.2rem;
	margin-top: 0.03rem;
}
.xiao .num {
	width: 5%;
	height: 0.3rem;
	margin-left: 0.1rem;
	font-weight: 700;
	text-align: center;
	line-height: 0.3rem;
}

/* 中间区域 */
.zhong {
	width: 95%;
	height: 100%;
	line-height: 0.3rem;
	padding-left: 5px;
	font-weight: 700;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}
</style>